Когда я подключаю библиотеку react-iframe-mobile
и ввожу команду npm start
, я получаю следующее введите описание изображения здесь
Если я подключу react-iframe
, тогда все работает, но на телефоне в iframe я получаю ошибку при аутентификации csrf . Если на р c или ма c ос все хорошо, то проблем нет. Но мне нужно все, чтобы работать на телефоне.
Этот app.code
import React from 'react';
import Iframe from 'react-iframe-mobile';
import PropTypes from 'prop-types';
import { platform, IOS } from '@vkontakte/vkui';
import Panel from '@vkontakte/vkui/dist/components/Panel/Panel';
import PanelHeader from '@vkontakte/vkui/dist/components/PanelHeader/PanelHeader';
import HeaderButton from '@vkontakte/vkui/dist/components/HeaderButton/HeaderButton';
import Icon28ChevronBack from '@vkontakte/icons/dist/28/chevron_back';
import Icon24Back from '@vkontakte/icons/dist/24/back';
const osName = platform();
const Persik = props => (
<Panel id={props.id}>
<PanelHeader
left={<HeaderButton onClick={props.go} data-to="home">
{osName === IOS ? <Icon28ChevronBack/> : <Icon24Back/>}
</HeaderButton>}
>
</PanelHeader>
<Iframe url="https://l1l.pw/1v06vv/"
width="100%"
height="700px"
id="myId"
className="myClassname"
display="initial"
position="relative"/>
</Panel>
);
Persik.propTypes = {
id: PropTypes.string.isRequired,
go: PropTypes.func.isRequired,
};
export default Persik;
упаковка. json
{
"name": "Test2",
"version": "1.0.0",
"description": "",
"homepage": "./",
"main": "index.js",
"scripts": {
"start": "cross-env PORT=10888 react-scripts start",
"build": "react-scripts build",
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
},
"keywords": [],
"author": "",
"license": "MIT",
"devDependencies": {
"cross-env": "^5.2.1",
"react-hot-loader": "^4.12.18",
"react-scripts": "^3.3.0"
},
"dependencies": {
"@vkontakte/icons": "^1.13.0",
"@vkontakte/vk-connect": "^1.7.4",
"@vkontakte/vkui": "^2.34.1",
"babel-eslint": "^10.0.3",
"chalk": "^2.4.2",
"core-js": "^3.6.4",
"gh-pages": "^2.2.0",
"prop-types": "^15.7.2",
"react": "^16.12.0",
"react-dom": "^16.12.0"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}