Developers / JavaScript Widget

OutReserve JavaScript Widget

Put nearby outdoor stays and RV rentals on your website. Match your brand, choose a destination and connect your approved affiliate account.

Search
Content
Colors
Partner
Preview

Your widget

Sample imagery and prices. Preview makes no search or tracking requests.

Need a key? Request partner access with your website origins, verticals, expected traffic and affiliate account.

Install once. Place it anywhere.

Add the container where the cards belong. Add the asynchronous script just before </body>. For a script in <head>, use defer. The loader waits for the document and supports containers inserted later by your CMS.

For multiple widgets, use data-outreserve-widget on each container and give each a unique ID. One script serves all instances. Repeated script inclusion does not mount a second copy.

The snippet builder produces a pinned file with an integrity hash. The optional https://outreserve.com/widgets/v1/widget.js loader follows compatible v1 updates; pinned installations must update their URL and hash together when upgrading.

const container = document.getElementById('outreserve-widget');
const widget = OutReserveWidget.mount(container, { location: 'Vancouver, Canada' });
widget.update({ colorAccent: '#005fcc', heading: 'Stay nearby' });
widget.refresh();
widget.destroy();

Call the JavaScript API after the loader's load event. Configuration precedence is library defaults, container attributes, then explicit JavaScript options. Changing a supported attribute updates the widget. Text is always rendered as plain text.

Configuration reference

AttributeContract
data-widget-keyRequired publishable key. Never use a server API key.
data-verticalstays (default) or rv-rental. RV inventory is currently Canada-only. Your key must allow the vertical.
data-location / data-lat + data-lngUse a place name (2-160 characters) OR both coordinates. Coordinates are rounded to 4 decimal places. Ambiguous names should include a region and country.
data-radius / data-radius-unitDefault 50 km. Units: km or mi. Radius: 1-500 km or 1-310 mi.
data-limit1-12 cards; default 6.
data-heading / data-subheadingPlain text, up to 120 / 240 characters. Empty text hides that line.
data-heading-levelSemantic heading level 2-6; default 2.
data-color-*background, surface, text, muted, accent, border, price, focus, button, button-text. Six-digit hex colors only. Low-contrast foregrounds fall back to readable colors.
data-card-radius / data-link-target0-16 px (default 6); _blank (default) or _self.
data-localeen, nl, de or es. Inventory titles remain in their source language. Prices stay in the inventory currency.
data-start-date / data-end-dateOptional paired ISO dates for stays, up to 60 nights and a year ahead. Display prices are indicative, not a quote. RV date filtering is not supported by v1.
data-site-typeOptional existing OutReserve stay type; e.g. cabin, tent or rv.
data-affiliate-idOptional. Defaults to the affiliate assigned to the key. A mismatched ID is rejected.
data-campaign-id / data-sub-idOptional reporting labels. 1-64 ASCII letters, digits, underscores or hyphens, starting with a letter or digit. Never include personal information.
data-trackingnone, essential (default) or analytics. None uses direct links; analytics additionally enables consented impressions.
data-consentdenied (default) or granted. Your consent manager must set granted before attribution cookies or impressions are enabled.

Affiliate attribution that follows the booking

Each live key is assigned to an approved affiliate. The server signs each card's link with its affiliate, campaign and listing. A verified link visit records the click and tags the destination URL. Browser-supplied affiliate parameters cannot change the commission recipient.

With consent granted, OutReserve stores an encrypted, HTTP-only, first-party attribution cookie after the click. The last eligible widget click is attached when a direct stay booking or booking request is created. The configured window is 30 days by default. Disabled keys, expired windows and test clicks cannot claim new bookings.

With consent denied, links still work and visits can be counted, but no attribution cookie or impression event is created. Browser privacy controls and clearing cookies can prevent attribution. Cross-device bookings and external-provider conversions require separate network reconciliation.

// Run when your consent manager reports a decision.
widget.update({ consent: 'granted', tracking: 'analytics' });
// When consent is withdrawn, stop tracking and use direct links.
widget.update({ consent: 'denied', tracking: 'none' });

Use outreserve:loaded, outreserve:error and outreserve:click events for your own integration. They contain result counts, error codes or inventory IDs, never the widget key or visitor details. Impressions require at least one card to remain 25% visible for a continuous second in a foreground tab. They are best effort and counted once per search configuration on each mounted widget, including after refresh.

Admins can report clicks by campaign and export attributed bookings with current payment and cancellation status. A click or paid booking is not a promise of commission: the partner agreement defines eligible revenue, refunds, cancellations, competing network claims and payout timing. Contact us for reconciliation and reporting access.

Security, performance and privacy

Consent withdrawal stops new partner-side tracking. A partner page cannot erase an existing cookie on OutReserve's domain; visitors can clear that first-party cookie in their browser. This setting does not delete previously collected attribution.

Widget keys are visible in your page. They allow only this public search and bounded impression API on approved exact origins. CORS helps enforce browser usage; quotas and server validation limit abuse by other callers. Register the www and non-www versions separately. Test keys may allow HTTP localhost; live origins require HTTPS.

The widget uses Shadow DOM for style isolation, plain-text rendering and approved HTTPS image/link hosts. It accepts no arbitrary HTML, CSS declarations, scripts, URLs or callback expressions. Requests omit credentials and referrers. No fingerprinting, local storage or third-party cookies are used.

Allow the following in your Content Security Policy, combined with your existing policy. No unsafe-eval or inline scripts are required. The widget uses an external stylesheet and individual CSS property assignments.

script-src https://assets.outreserve.com https://outreserve.com;
style-src https://assets.outreserve.com https://outreserve.com;
connect-src https://outreserve.com;
img-src https://media.outreserve.com https://assets.outreserve.com https://outreserve.com;

Immutable bundles are CDN-cacheable for a year. The compatible loader is cached for five minutes. Inventory data is cached internally for 45 seconds, with affiliate links added afterward; API responses are not shared-cacheable. Authorization is checked on every request, including cached searches.

The layout follows the container width: one column below 540 px, two below 850 px, then three. Images reserve their space and load lazily. Requests time out after 12 seconds. Refresh and destroy cancel obsolete work; unavailable inventory has a retry state.

Test and launch

  • Request a test key and register the exact development origin, including its port.
  • Test narrow containers, keyboard navigation, custom colors, empty results, consent changes and your site's CSP.
  • Use a live key only after your affiliate assignment and website ownership have been confirmed.
  • Check the admin report for a verified link visit and a consented test booking flow. Test keys never claim real bookings.

A 403 means the key or origin is not authorized; 422 means invalid search settings; 429 means the request budget is exhausted. The widget honors Retry-After for minute, hourly and daily budgets, including manual refreshes and other widgets using the same key on that page. Error events include a stable code, HTTP status when available and retryAfter in seconds. Browser-blocked CORS or network requests cannot expose the HTTP status.

Signed links renew automatically before their one-hour expiry and when returning to an open tab. If renewal fails, cards use untracked public links after expiry, preserving search dates but earning no affiliate credit for that navigation. The outreserve:links_expired event reports this fallback. Disabling a key still blocks signed-link attribution immediately.

Version 1.0.0 is the initial release. Breaking changes will use a new major version. Review updates before upgrading pinned installations. Rotate compromised keys in admin; the prior token has a 24-hour overlap, while disabling the key revokes both immediately.

Contact developer support with your origin, widget version and error code. Never send private API credentials or visitor information.

API terms · Prohibited sites and content