There is no prompt to grant permission for the Android app to access the camera

I'm currently working on an app using vue-js and cordova that involves the phone's camera for taking pictures. However, I am facing challenges in asking the user to grant permission for my app to access the camera.

Despite trying the cordova-plugin-android-permissions, the results have not been as expected.

( cordova plugin add cordova-plugin-android-permissions )

In my main.js file, I have added:


var permissions = cordova.plugins.permissions
permissions.checkPermission(permissions.CAMERA, success, null)

function error () {
  console.warn('Camera permission is not turned on')
}
function success (status) {
  if (!status.checkPermission) {
    permissions.requestPermissions(
      permissions.CAMERA,
      function (status) {
        if (!status.checkPermission) {
          error()
        }
      },
      error)
  }
}

Upon testing, my app only shows a white screen and during the build process, I received this message:


cordova is not defined

I am considering importing cordova for testing purposes, but unsure about the correct path for the import.

Additionally, I am uncertain if my current method is effective or if there are alternative ways to request device authorization.

Answer №1

You might not be using cordova correctly.

Make sure to wait for it to load by listening for the 'deviceready' event.

document.addEventListener('deviceready', () => {
      const permissions = cordova.plugins.permissions;
     // Your code here

Link: https://github.com/NeoLSN/cordova-plugin-android-permissions/issues/13

Additionally, you may need to use 'import VueCordova from 'vue-cordova''. I'm not certain about this but it's worth a try.

import VueCordova from 'vue-cordova'
...
Vue.use(VueCordova)

In your component data:

cordova: Vue.cordova

Answer №2

Have you attempted to include the following code in your AndroidManifest.xml file:

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.FLASHLIGHT" />
<uses-feature android:name="android.hardware.camera" android:required="true" />

Referencing this post for more information: Cordova App 'Android permission Cordova plugin' is not showing permission dialog

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Smoothly transition with ease when hovering over a link

Hey there! I'm looking to create a menu that is similar to what you can find on this website: I've been thinking about using animate.css with the slideInDown animation to make the bookmark show up when hovering over a link. However, I'm not ...

Concerns regarding the set-up of the latest React application

My goal is to become proficient in React, so I decided to install Node.js (v 10.16.0 LTS) and run the following commands using Windows Powershell: npx create-react-app my-app cd my-app npm start However, after making changes to the code (such as modifyin ...

Using anchor tags to send HTML code through email

I currently have an anchor tag on my website that looks like this: <a href="mailto:<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="7e0d11131b11101b3e0d11131b09161b0c1b501d1113">[email protected]</a>?subject=Wel ...

The ts-loader seems to be malfunctioning (It appears that a suitable loader is required to handle this file type, as no loaders are currently set up to process it)

I'm currently in the process of integrating TypeScript into a JavaScript project, but it seems like webpack is not recognizing the ts-loader for files with the .tsx extension. I've attempted to use babel and even tried awesome-ts-loader, but none ...

Guide to filling a dropdown menu by aligning with the text it contains?

I've set up two dropdown select boxes below that are exactly the same: HTML <select id="ddl1" name="ddl1"> <option value="1">TEXT 1</option> <option value="2">TEXT 2</option> <option value="3">TEXT 3&l ...

Content moves as you scroll, not within a lightbox

I have implemented lightbox style overlays for my 'Read More' content on my website. However, I am facing an issue where the content within the lightbox does not scroll; instead, the background page scrolls. Any assistance with resolving this p ...

Size attribute set to 0 for an HTML input element

When an input element is rendered, it should have a width of 0. However, when there is no text in the input, the width should remain 0. To achieve this, you can use the following jQuery code: $('input').on('input', function () { $(th ...

What steps should be taken to fix the org.json.JSONException error stating "No value for index"?

I have developed an app that showcases wallpapers. The data for the wallpapers is stored in a JSON database hosted online on a server. Upon launching the app, I encountered the following error: org.json.JSONException: No value for index This is the JSON ...

Styling the alert box with Bootstrap

My login error project utilizes the bootstrap alert to display errors. However, the issue I am facing is that when there is no error, it shows an empty box. Can someone help me figure out how to hide this div initially and only show it when an error occurs ...

Ways to retrieve a specific value from a JSON dataset

I currently have an Ajax live search script with multiple text inputs for searching products. The live search functionality works perfectly, but I have a query: If I decide to change the name of a product, how can I go back to the previous page and re-s ...

Tips on utilizing Media Player on Android devices

I have been working on a demo for a media player in an Android application, but I am encountering a problem. When I run my app, the song starts playing but does not play the full length - it just starts and immediately stops, going into the resume() stat ...

Uncovering the JavaScript Linked to a Specific Element

Is there a way to link directly to the JavaScript controlling a particular HTML element, unlike the typical "inspect element" approach which is limited to HTML and CSS? ...

Retrieving the correct selected value from multiple select tables created through a for loop can be achieved using JavaScript or jQuery

Despite searching Google and asking previous questions, I have not found a solution that addresses my specific issue. The common responses only pertain to one select element with multiple options. To further clarify, when I create code for a loop to genera ...

The application experiences crashes when attempting to delete an item from the ListView

One of the challenges I am facing involves an SQLite table in a specific activity where I retrieve all the names from the table and display them in a listview. Within the listview listener, users have the ability to delete the selected item. The issue ar ...

The execution of Javascript should be limited to when the tab or browser window is in focus

Similar Question: Detect If Browser Tab Has Focus I have developed a basic Java applet that is capable of capturing a client's screen. By using a small piece of JavaScript code, I can initiate the applet and capture the active screen image. Howe ...

The command `grunt.option('force', true) isn't functioning properly

After reviewing the grunt.options documentation, my initial expectation was that I could initiate a Grunt task programmatically with the force option activated in this manner: var grunt = require('grunt'); grunt.option('force', true); ...

Determine the dimensions of the objects within a JSON array

My JSON response creation looks like this : { "G5LDUHRPEEA6B-39CFBWYA": [], "JMSK0DKOEEA0UXMY750O3W": [], "ISVN8JF1EEAD3W398ZNOSA": [ { "delloData": "1478644629", "ref": "75", "dataType": "String", "somePart": LA, ...

Displaying URLs stylishly with Pills Bootstrap

When a pill is selected from the list, I need to display a specific URL that can be used elsewhere. However, there is an href="#pills-something" attribute that directs to an ID below. I am looking for something like: mysite.com/myspecificpill or ...

Experiencing difficulties when trying to upload images using multer in an Express application with Node.js

I have been using multer to successfully upload images into a folder within my project. Despite not encountering any errors while using multer, I am facing an issue where the upload is not functioning as expected in my project, although it works perfectly ...

Sending JSON data from an Angular service to a directive

Trying to pass a JSON object from an Angular service to a directive is proving to be tricky. My goal is to dynamically $compile a directive and send an object to it. The setup should resemble something like this: var template = '<gmap-info-window ...