how to show cropped image on screen?

[crapthings]

what permission should i enable on ios and android, it looks both os doesn't allowed access file:// on default

An example file URI obtained from success call back of scanDoc function looks like this file:///var/mobile/Containers/Data/Application/8376778A-983B-4FBA-B21C-A4CFDD047AAA/Documents/image.png

i already add this line into head

<!-- This policy allows everything (eg CSS, AJAX, object, frame, media, etc) except that 
    * CSS only from the same origin and inline styles,
    * scripts only from the same origin and inline styles, and eval()
-->
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

and with meteor there's a mobile-config that can mapping cordova config.xml like this

App.accessRule('*')
App.accessRule("blob:*")

App.accessRule('http://*/*', { type: 'navigation' })
App.accessRule('https://*/*', { type: 'navigation' })
App.accessRule('data:*', { type: 'navigation' })

into

[ChrisTomAlx]

Hey.. I use cordova cli directly. In that all I do is take the file URI that I get from the on success event then put it into an image which was specified as <img id="myImage"> within the html file. No other permissions are required to be explicitly specified in the config.xml.

var image = document.getElementById('myImage');
image.src = imageURI;

Cheers, Chris Neutrinos

[crapthings]

i've tried cordova cli, but still same result, something like no permission to read file

[ChrisTomAlx]

Is this on iOS? Android? Or both?

Cheers, Chris Neutrinos

[ChrisTomAlx]

I just tested it again on ios (just to confirm) and it seems to be working fine. What version of ios are you using?

Cheers, Chris Neutrinos

[crapthings]

10.3 ?

let me try again

[ChrisTomAlx]

@crapthings Were you able to resolve your issue? If you were, please close this issue and let us know how you resolved it.

Cheers, Chris Neutrinos

[crapthings]

i've made a video to explain how to display image with wkwebview this can apply to this cordova plugin as well

https://github.com/crapthings/cordova-upload-file-example

https://www.youtube.com/watch?v=HUestthvr50

to display an image you have to use something like window.Ionic.WebView.convertFileSrc(cordova ionic web view)

cordova

const image = document.getElementById('preview')
image.src = window.Ionic.WebView.convertFileSrc(fileUrl)

plus if you want to upload file from html input rather then FileURL this is the minimal example to work with.

cordova

<form>
<input type='file' name='file' />
</form>

cordova

document.querySelector('input').onchange = function(evt) {
  const data = new FormData(evt.target.form)
  const xhr = new XMLHttpRequest()
  xhr.open('POST', 'http://localhost:3000', true)
  xhr.send(data)
}

server side

var express = require('express')
var multer  = require('multer')
var upload = multer({ dest: 'uploads/' })

var app = express()

app.post('/', upload.single('file'), function (req, res, next) {
  console.log(req.file)
  res.json(req.file)
})

app.listen(3000)