How to link to a public url from ion-button? - html

I want to link to a public url where my login is hosted from a button in my app. I know how to link to pages in my app but not sure how to link outside my app.
I couldn't find much when i searched for it.
Is there an ionic way to do this (which is preferred) or would i have to go the html href route?

Install #capacitor/browser.
npm install #capacitor/browser
npx cap sync
example function :
import { Browser } from '#capacitor/browser';
async openCapacitorSite (url:String) {
//urlFormat http://capacitorjs.com/
await Browser.open({ url });
};

Related

Add an html file to the build version of react

I have a landing file which is in pure HTML. (landing.html)
I want the main URL of the website to be this file and the rest of the URLs to go in the React app.
For example:
example.com -> landing.html
example.com/app -> react app
example.com/login -> react app
As I said, I want the main URL to read the landing.html.
But the rest of the app should read the build version of React.
If it's possible i want it to be a part of the React app and not adding it directly in build folder. After running build it should be automaticly in build folder so basicly kinda implicitly to be a part of react app.
One more thing I dont want to convert it to jsx. 😁
How can I implement this ?
For the landing page use
var __html = require('./template.html');
var __html = require('./template.html');
var template = { __html: __html };
React.module.exports = React.createClass({
render: function() {
return(
<div dangerouslySetInnerHTML={template} />
);
}
});```
on / route and other react components use on app and login route
I researched a bit and found two solution for it.
First : Using multipage app feature in Vite.
Second: confining nginx on server for this feature. (I didn't do the configuration someone else did, but it worked)

How can I generate a PDF of the current web page on button click?

How can I create and download a PDF version of the current web page (which is open in browser) on button click?
I am assuming you use jquery on client-side.
$('#button_id').click(function(){
window.print();
});
Which will guide you to print menu where you can choose "Save as PDF" which will save your current view as pdf.
Did it solve your issue?
You can look at Nuget package: Rotativa http://nuget.org/packages/Rotativa. It's based on wkhtmltopdf.
Usage is really simple.
Having an action you would like to serve as Pdf, instead of Html page. You can define an action that returns an ActionResult of the type ActionAsPdf (RouteAsPdf is also available). So the code is just:
public ActionResult PrintIndex()
{
return new ActionAsPdf("Index", new { name = "Giorgio" }) { FileName = "Test.pdf" };
}
With name = "Giorgio" being a route parameter.
Look at this GitHub
If i am getting you right. You want to generate a PDF from HMTL. Rotativa plugin is a good choice. Also, mentioned by Janmejay Kumar. If you want to implement this plugin. Please ask if you have any doubt .I have used this plugin for PDF and for image generation.

In angularjs application, html pages display even though a user is not logged in

I have an angularJS application which requires logging in. I have defined my states in the application. If I don't log in and directly open a state in the browser it redirects to 404.
The issue is when I explicitly open a .html page in browser without logging in, it shows me the HTML elements and non-rendered angularJS expressions. In the network tab of developer tools, the Status Code is 200. How do I get 404 instead and the same to redirect to 404 or login page?
My application is hosted on Apache Tomcat.
Any help is appreciated.
Update:
The following is an example: (I can't provide code though).
Let's say I have a folder client with ClientView.html as the view in the folder. The following would be the route in my app.js
.config(function ($stateProvider, $httpProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
.state('app.client', {
// child state of `app`
url: '/client',
views: {
'content#app': {
templateUrl: 'client/ClientView.html',
controller: 'ClientCtrl'
},
data: {
requireLogin: true
}
}
})
});
If I access the application as http://localhost/app/client without logging in, this does take me to 404.
But if I try to access http://localhost/app/client/ClientView.html then it shows me the html elements in that page as well as non-rendered AngularJs expressions. How do I redirect to login page or 404?
Set a variable isAppLog = true when user logs in. And check for login or not using:
$rootScope.$on('$stateChangeStart', function(event, toState , toParams, fromState, fromParams)
{
if(toState.data.requireLogin=== true && !$rootScope.isAppLog ) {
event.preventDefault();
$state.go('login');
}
});
This checks for whether user loggedin or not and if not redirects to login page.
So, this is how I handled it currently. If login is successful, I have created and set sessionStorage variable to true. In every HTML page in my application, I have added a short script, checking the above flag. If it's not set then I redirect to 404 page.
This is clearly not the right way to do it and has redundacy. If anyone else has a better approach, kindly let me know!

AngularJS URL's with HTML5 mode doesn't work

Using the AngularJS SPA template for visual studio. Inside my app.js I have:
$stateProvider
.state('touranalysis', {
url: '/touranalysis',
templateUrl: '/views/touranalysis/index',
controller: 'tourAnalysisCtrl'
})
$locationProvider.html5Mode(true);
If I'm running locally and click on my link for touranalysis it works fine. Here's the link in my nav bar.
Tour Analysis
But if I'm on that page, which is
http://localhost:8080/touranalysis
and I click F5, I get a page not found error. What am I missing?
I guess you don't have touranalysis page in your server. You are getting page not found error because the browser requests touranalysis page when you click F5. Angular routing will work after you have your page loaded. If I am correct, your template is using ASP.NET MVC. So you can add a custom route like this:
routes.MapRoute(
name: "touranalysis",
url: "touranalysis",
defaults: new { controller = "touranalysisController", action = "Index" });
This way ASP.NET MVC will load Index view of touranalysisController which should contain ng-view. After that Angularjs will load /views/touranalysis/index
I hope this helps. Please let me know if you have any questions.

Can I add a page tab app to a differenrt App profile page?

I wanted to know if I can add a page tab app I created to a different App profile page like I can add it to regular pages on Facebook. I can't see all my app profile pages(only regular pages are listed) when I click under a profile app page the link "Add to My Page".
Yes you can do that by visiting a link:
http://www.facebook.com/add.php?pages=1&api_key=APP_ID
This will bring you list of all pages (including application pages) you own, or you can specify directly which page should be used to add application to:
http://facebook.com/add.php?pages=1&api_key=APP_ID&page=PAGE_ID
If you want to do it using Graph SDK (in kind of background, silent mode - avoiding the user interaction), then you need to make a call like this
You need to get the manage_pages permission first, and then
if (accessToken) {
var data = {
"access_token": accessToken,
"app_id":applicationId
}
FB.api("/" + pageId + "/tabs", 'post', data, function(response) {
//success or failure, check it out
});
}
It will install the application on your application profile as a tab :)
Hope it will help.