# Install Qwary Intercept with Single Page Applications

An SPA is a type of website that loads all the resources needed to navigate the entire site on the initial page load, unlike traditional websites that load each page individually as visitors navigate through the site. However, the default Qwary installation snippet, similar to tag managers and analytics codes, is optimized for traditional websites. If you have an SPA, you'll need to use refresh pageviews to indicate when a visitor has moved from one page to the next. In this article, we'll explain how to use refresh pageviews for Qwary intercept campaigns.

This article will cover the usage of refresh pageviews for Qwary intercept campaigns. 

These requirements will be elaborated upon in the following sections.

* Refresh pageviews in Qwary simulate the function of an actual pageview on websites that do not reload the entire document.
* They are triggered by calling Qwary's Javascript API when a visitor switches from one page to another.
* When a refresh pageview is triggered, Qwary updates and rechecks the current campaign targeting settings to ensure accuracy.
* There are several targeting options available for refresh pageviews in Qwary, including visitor on a particular page, visitors after being on the page for X seconds, visitors potentially exiting the page after X seconds, visitors having viewed at least X pages, and manual trigger.
* The refresh pageviews targeting options help ensure that your campaign targeting is accurate and up-to-date, and can be used to achieve your goals.

### **How to setup virtual pageview?**

qwTracking**.**refreshPageView() command is used to trigger page refresh by SDK API.

1. Vanila JS

`window.history.pushState('p1', 'Test Title', '/test_page.html');` 

`window.qwTracking.refreshPageView();`

2. Angular 2 Router

`import { Router, NavigationStart, Event as NavigationEvent } from '@angular/router';` 

`constructor(router:Router) { router.events.forEach((event: NavigationEvent) => { if(event instanceof NavigationEnd) { window.qwTracking.refreshPageView(); } }); }`

3. VueJS Router

`import router from './router';` 

`router.afterEach((to, from) => { window.qwTracking.refreshPageView(); });` 

`new Vue({ el: '#app', router, template: '', components: { App } })`

4. React JS Router

`Router.run(routes, Router.HistoryLocation, function (Handler) { React.render(, document.body); window.qwTracking.refreshPageView(); });`

In conclusion, refresh pageviews are a way for Qwary to update and recheck campaign targeting settings when a visitor switches from one page to another.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.qwary.com/product-guide/faq/install-qwary-intercept-with-single-page-applications.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.