How to use local json file in swagger-ui documentation - swagger

I am trying to use local swagger.json file to be displayed in swagger documentation.
My swagger.json file is under /home/user1/swagger-ui/dist/swagger.json and the index.html resides under the same directory. I have modified the index.html as below.
window.swaggerUi = new SwaggerUi({
spec: ../swagger.json
url: url,
dom_id: "swagger-ui-container",
After starting the docker instance using docker run -p 80:8080 swagger-ui-builder, accessing http://192.168.xx.xx/ does not display the documentation. Attaching the screenshot for reference. Please help me to resolve this.

The sample provided in the question cannot work at all (missing coma and spec is not a SwaggerUI property).
To show your swagger.json file which is in the same folder as index.html you just need to replace url = "http://petstore.swagger.io/v2/swagger.json" by url = "swagger.json"; in index.html.
Original index.html
var url = window.location.search.match(/url=([^&]+)/);
if (url && url.length > 1) {
url = decodeURIComponent(url[1]);
} else {
url = "http://petstore.swagger.io/v2/swagger.json";
}
[...]
window.swaggerUi = new SwaggerUi({
url: url,
dom_id: "swagger-ui-container",
supportedSubmitMethods: ['get', 'post', 'put', 'delete', 'patch'],
onComplete: function(swaggerApi, swaggerUi){
if(typeof initOAuth == "function") {
initOAuth({
clientId: "your-client-id",
clientSecret: "your-client-secret-if-required",
realm: "your-realms",
appName: "your-app-name",
scopeSeparator: ",",
additionalQueryStringParams: {}
});
}
Modified:
var url = window.location.search.match(/url=([^&]+)/);
if (url && url.length > 1) {
url = decodeURIComponent(url[1]);
} else {
url = "swagger.json";
}
[...]
window.swaggerUi = new SwaggerUi({
url: url,
dom_id: "swagger-ui-container",
supportedSubmitMethods: ['get', 'post', 'put', 'delete', 'patch'],
onComplete: function(swaggerApi, swaggerUi){
if(typeof initOAuth == "function") {
initOAuth({
clientId: "your-client-id",
clientSecret: "your-client-secret-if-required",
realm: "your-realms",
appName: "your-app-name",
scopeSeparator: ",",
additionalQueryStringParams: {}
});
}

Here was a solution I found here (pretty quick and painless if you have node installed):
With Node, globally install package http-server npm install -g http-server
Change directories to where json is located, and run the command http-server --cors (CORS has to be enabled for this to work)
Open swagger ui (i.e. dist/index.html)
Type http://localhost:8080/my.json in input field and click "Explore"

I have several Swagger files and would like to easily switch between them. So I changed index.html to get the first URL parameter and open swagger-ui with that.
I have bookmarks for the different files:
index.html?file1
index.html?file2
etc..
<script>
window.onload = function() {
var url = window.location.search.substring(1);
if (url.length == 0) {
url = "swagger.json";
}
// Build a system
const ui = SwaggerUIBundle({
url: url,
dom_id: '#swagger-ui',
deepLinking: true,
presets: [
SwaggerUIBundle.presets.apis,
SwaggerUIStandalonePreset
],
plugins: [
SwaggerUIBundle.plugins.DownloadUrl
],
layout: "StandaloneLayout"
})
window.ui = ui
}
</script>

Related

How can I set the baseURL for expect in playwright?

In my Playwright tests, I set the base-url according to the docs:
const config: PlaywrightTestConfig = {
projects: [
{
name: 'Safari MacBook Air',
use: {
browserName: 'webkit',
viewport: {
width: 2560,
height: 1620,
},
contextOptions: {
ignoreHTTPSErrors: true,
},
},
},
],
use: {
baseURL: process.env.PLATFORMSH_URL,
headless: false,
locale: 'ja-JP',
// Debugging artifacts.
screenshot: 'on',
trace: 'on',
video: 'on',
},
};
export default config;
This is working for goto:
await this.page.goto('/myDirectory');
However, it fails for expect:
expect(page.url()).toBe('/myPage');
The error is:
Expected: "/myPage"
Received: "https://www.example.com/myPage"
How can I use expect with baseURL?
Try using this assertion instead:
For example, having configured Playwright homepage as our baseUrl
{
name: 'webkit',
use: {
...devices['Desktop Safari'],
baseURL: 'https://playwright.dev/'
},
},
Then:
test('baseUrl', async ({ page }) => {
await page.goto('/docs/intro');
await expect(page).toHaveURL('/docs/intro');
});
If you'd like to continue using this format:
expect(page.url()).toBe('/myPage');
Then you need to change the assertion, because the url you're at is not equal to your directory. You can assert the url you're at contains the aforementioned directory, instead:
expect(page.url()).toContain('/myPage');
There is nothing wrong in your code except the last line.
page.url() will give you the whole URL address on wich your
driver (browser,whathever) currently is, and expect(something)toBe(thing) is like equals, and it will fail in your case.
You can assert in several ways like:
await expect(page.url().includes(partOfUrl)).toBeTruthy();
In the end I just wrapped it in my own utility function:
const pwaBaseUrl = process.env.NOSLASH_URL;
export const assertPath = async (page: Page, path: string) => {
expect(page.url()).toBe(`${pwaBaseUrl}/${path}`);
};
This guarantees that I am on the exact path. Perhaps this isn't generally necessary, but coming from Behat testing on PHP, this is what I'm used to.

Request with GET/HEAD method cannot have body APOLLO-CLIENT

I'm using docker network and try to use apollo-client, apollo-upload(createUploadLink) and I try to sent Barear token in headers too. the error show up Request with GET/HEAD method cannot have body
But if I change my url into real url [ not dockerNetwork everything work fine]
export const client = (req) => {
const uri = http://dockerNetwork:3000
return new ApolloClient({
link: authLink(req).concat(createUploadLink({
uri: uri ',
});),
cache: new InMemoryCache(),
});
};
const authLink = req => {
return setContext(_ => {
return {
headers: {
...req.headers,
authorization: `Bearer ${req.cookies.token)}`,
},
};
});
};
How can I fix this error by using docker network
Finally I found solution, first I use
"#apollo/client": "3.4.20"
"apollo-upload-client": "^16.0.0",
and I downgrade apollo/client to 3.3.20
"#apollo/client": "3.3.20",

Cordova deeplinks - query parameter not detected from Universal Links

I am trying to add Universal Linking to a Cordova App using the ionic-plugin-deeplinks plugin.
According to this issue query parameters should work out of the box.
Universal Links for me work correctly except for links with query parameters.
Eg. https://my-site.com/?olddeeplinking=resetpassword&token=123
When I click on the link in an email the queryString field is always an empty string.
Am I missing something, do I need to enable the plugins to detect query params?
Here is the code that I'm using:
const deepLinkRoutes = {
'/user/login': {
action: 'showLogin',
resetUrl: '/',
},
'/user/forgot-password': {
action: 'showForgotPassword',
resetUrl: '/',
},
...
};
export const _getIonicRoutes = () => Object.keys(deepLinkRoutes)
.reduce((links, route) => {
links[route] = { target: '', parent: '' };
return links;
}, {});
export const handleUniversalLinks = () => {
const ionicRoutes = _getIonicRoutes();
const sy = obj => JSON.stringify(obj);
const matchFn = ({ $link, $route, $args }) => {
console.log('Successfully matched route', $link, $route, $args);
alert(`Successfully matched route: ${sy($link)}, ${sy($route)}, ${sy($args)}`);
return history.push($link.path);
};
const noMatchFn = ({ $link, $route, $args }) => {
console.log('NOT Successfully matched route', $link, $route, $args);
alert(`NOT Successfully matched route: ${sy($link)}, ${sy($route)}, ${sy($args)}`);
return history.push($link.path);
};
window.IonicDeeplink.route(ionicRoutes, matchFn, noMatchFn);
};
UPDATE:
It looks like the intent received on Android is always /user/login even though the Universal Link does not have it. What could be causing that?
2019-10-21 17:22:47.107 30389-30389/? D/MessageViewGestureDetector: HitTestResult type=7, extra=https://nj.us.gpd.my_company-dev.com/user/login
2019-10-21 17:22:47.139 1128-1183/? I/ActivityManager: START u0 {act=android.intent.action.VIEW dat=https://nj.us.gpd.williamhill-dev.com/... cmp=us.my_company.nj.sports.gpd/.MainActivity} from uid 10147
A clue:
It looks like the deeplinks plugin is using window.location.href to detect the query parameter.
Since I am using cordova-plugin-ionic-webview the href is always the alias used for localhost of the Ionic engine serving the App contents, so the query parameters are never found.
Deeplinks plugin code:
https://github.com/ionic-team/ionic-plugin-deeplinks/blob/master/src/browser/DeeplinkProxy.js#L40
function locationToData(l) {
return {
url: l.href,
path: l.pathname,
host: l.hostname,
fragment: l.hash,
scheme: parseSchemeFromUrl(l.href),
queryString: parseQueryStringFromUrl(l.href)
}
}
onDeepLink: function(callback) {
// Try the first deeplink route
setTimeout(function() {
callback && callback(locationToData(window.location), {
keepCallback: true
});
})
// ...
}
This is the problem, not sure on the solution yet though.

Getting No 'Access-Control-Allow-Origin' with Swagger and Foreman Rails server

I have my server currently running at 0.0.0.0:5100. When I try to access my Swagger docs, I get the following error in the console:
XMLHttpRequest cannot load http://0.0.0.0/api/v1/types.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://0.0.0.0:5100' is therefore not allowed access.
I am wondering why is that happening. Here is my Swagger configuration in index.html:
$(function () {
window.swaggerUi = new SwaggerUi({
url: "/api-docs.json",
dom_id: "swagger-ui-container",
supportedSubmitMethods: ['get', 'post', 'put', 'delete'],
onComplete: function(swaggerApi, swaggerUi){
log("Loaded SwaggerUI");
if(typeof initOAuth == "function") {
/*
initOAuth({
clientId: "your-client-id",
realm: "your-realms",
appName: "your-app-name"
});
*/
}
$('pre code').each(function(i, e) {
hljs.highlightBlock(e)
});
},
onFailure: function(data) {
log("Unable to Load SwaggerUI");
},
docExpansion: "none"
});
Have you enabled CORS support for your web-service? The Swagger documentation calls out that CORS support is required for that to work. The error message you are getting is the exact same message I was getting on my Grails project before I added CORS support.
Allow-Control-Allow-Origin: * extension on chrome store added into the browser.
Note: Once you done with work disable this options becasue youtube will not work with enable option.

Sencha touch customise rest proxy url

I need to pass addition param to jersey server. But how do I submit my url like ..get/{param1}/{param2}/{param3}
Here is my js file
Ext.define('bluebutton.view.BlueButton.testing', {
extend: 'Ext.form.Panel',
xtype: 'testing',
requires: [
'bluebutton.view.BlueButton.TransactionList',
'bluebutton.view.BlueButton.MemberPopUp',
'bluebutton.view.BlueButton.MemberDetail',
'bluebutton.store.BlueButton.MemberList',
],
config: {
id:'register',
items :[
{
xtype: 'textfield',
name: 'name',
label: 'Name'
},
{
xtype: 'emailfield',
name: 'email',
label: 'Email'
},
{
xtype: 'button',
text: 'Send',
handler: function(button) {
var form = Ext.getCmp('register');
values = form.getValues();
// Select record
//If load data , restful will using "get", url will be /users/1
var User = Ext.ModelMgr.getModel('bluebutton.model.BlueButton.MemberList');
User.load(123,
{
success: function(user) {
alert(user.get('fullName'));
}
}
);
}
}
],
}
});
Model.js
Ext.define('bluebutton.model.BlueButton.MemberList', {
extend: 'Ext.data.Model',
config: {
idProperty: 'memberModel',
fields: [
{ name: 'fullName' },
{ name: 'singer' },
],
proxy: {
type: 'rest',
url: 'http://localhost:8080/RESTFulExample/rest/json/metallica/get',
reader: 'json',
actionMethods: {
create: 'GET',
read: 'POST',
update: 'PUT',
destroy: 'DELETE'
},
reader: {
type: 'json',
},
writer: {
type: 'json',
},
}
}
});
But now I only able to pass my url like ..get/123 Please guide me some solution.Thanks
2 things coming to my mind, First do not write proxy inside model definition, instead set it in initialize function of store where you can look at config data and create url on its basis. e.g.
initialize: function() {
var myId = this.config.uid;
this.setProxy({
type: 'rest',
url: 'http://localhost:8080/RESTFulExample/rest/json/metallica/get/'+myId,
reader: 'json',
actionMethods: {
create: 'GET',
read: 'POST',
update: 'PUT',
destroy: 'DELETE'
},
reader: {
type: 'json',
},
writer: {
type: 'json',
},
});
}
and you can pass id to load when you create the store like this:
var memberStore = Ext.create('bluebutton.store.BlueButton.MemberList', {
uid : 123
});
2nd way could be writing your own proxy extending Ext.data.proxy.Rest and implementing buildUrl such that it checks for data and append it to url. e.g.
buildUrl: function(request) {
var me = this,
url = me.callParent(arguments);
if(!Ext.isEmpty(someData)){
url = Ext.urlAppend(url, "data="+someData);
}
return url;
}
I hope it helps.
EDIT
Sample code for custom proxy which I have used in past to append some token to every request
Ext.define('myapp.proxy.CustomJsonpProxy', {
extend: 'Ext.data.proxy.JsonP',
alias: 'proxy.customjsonpproxy',
buildUrl: function(request) {
var me = this,
url = me.callParent(arguments);
if(!Ext.isEmpty(loggedInUserToken)){
url = Ext.urlAppend(url, "token="+loggedInUserToken);
}
return url;
}
});
the below code worked for me....to set a param to an url
myStore.getProxy().getApi().read = myStore.getProxy().getApi().read + param;

Resources